<template>
  <div class="about">
    <h1>This is an about page</h1>
    <el-button @click="fetchLogin">登陆按钮</el-button>
  </div>
</template>
<script>
import { mapMutations } from 'vuex'
import myMinxin from '../minxins'
import { Message } from 'element-ui'
export default {
  data() {
    return {
      userInfo: {
        username: 'admin',
        password: '123',
      },
    }
  },
  // mixins: [myMinxin],
  created() {},
  methods: {
    ...mapMutations(['set_token']),
    async fetchLogin() {
      // 函数式调用 提示组件
      // this.$message.error('这是一条消息提示')

      // 组件式调用
      Message({
        showClose: true,
        message: '警告哦，这是一条警告消息',
        type: 'error',
      })
      const res = await this.$http.post('/api/login', this.userInfo)
      console.log('r:', res.data)
      if (res.data.code === 0) {
        this.set_token(res.data.data.token)
        // this.$router.push('/')
      }
    },
  },
}
</script>
<style scoped>
.about {
  height: 400px;
  background: lightcoral;
}
</style>
